import Vue from "vue";
import VueRouter from "vue-router";
import routes from "./routes";
import NProgress from "nprogress";
import "nprogress/nprogress.css";
import store from "@/store";
 
Vue.use(VueRouter);

const router = new VueRouter({
    mode:"history",
    routes,
    scrollBehavior(){
        return {
            x:0,y:0
        }
    }
})


/* 
## 路由跳转鉴权（免密登录，token 校验）

- 如果 token 存在

  - 判断我们去的是不是登录页，如果是，则直接导航到首页
  - 判断用户名是否存在

    - 如果存在

      - 说明用户刚刚鉴权过，不需要再鉴权(因为只要页面一刷新或者重新打开，则用户名就会消失)然后直接放行

    - 如果不存在
      - 拿到 token 去请求用户信息
      - 如果请求用户信息成功，则直接放行
      - 如果请求用户信息失败，则说明 token 过期或者被篡改，此时就要直接跳转到登录页(并且一定要删除 token)

- 如果 token 不存在
  - 判断当前要去的页面是不是必须登录才能访问的
    - 如果是：跳转到登录页，让用户登录
    - 如果不是，则直接放行
 */
const whiteList = ["Home","Login","Register","Search","Detail"]
//进度条的配置
//使用全局前置守卫配置开启进度条
router.beforeEach(async (to,from,next)=>{
    //进度条的配置
    NProgress.start()

    //如果 token 存在
    if(store.state.User.token){
        // - 判断我们去的是不是登录页，如果是，则直接导航到首页
        console.log(1);
        
        if(to.name === "Login"){
            console.log(2);
            next("/home")
        }
        //  - 判断用户名是否存在 ,说明用户刚刚鉴权过，不需要再鉴权
        const existsUserMessage = !! store.state.User.userMessage.nickName   
        
        if(existsUserMessage){
            console.log(3);
            next()
        }else{
            // 如果不存在 拿到 token 去请求用户信息
            try{
                console.log(4);
                await store.dispatch("User/getUserMessage")
                next()
                 
            }catch(e){
                // - 如果请求用户信息失败，则说明 token 过期或者被篡改，此时就要直接跳转到登录页(并且一定要删除 token)
                store.commit("User/remove_token")
               next("/login")
            }
        }
    }else{
        // 如果 token 不存在 ,判断当前要去的页面是不是必须登录才能访问的
        if(!whiteList.includes(to.name)){
            console.log(6);
            next("/login")
        }
        next()
    }
})
//使用全局后置钩子配置关闭进度条
router.afterEach(()=>{
    //进度条的配置
    NProgress.done()
    
})
export default router